<template>
  <div>
    <div class="toolbar">
      <ul>
        <li><router-link to="/recomm">推荐</router-link></li>
        <li><router-link to="/toplist">排行版</router-link></li>
        <li><router-link to="/playlist">歌单</router-link></li>
        <li><router-link to="/djradio">主播电台</router-link></li>
        <li><router-link to="/artist">歌手</router-link></li>
        <li><router-link to="/album">新碟上架</router-link></li>
      </ul>
    </div>
    <div>
      
       <!-- 配置二级路由出口 -->
       <keep-alive>
          <router-view v-if="$route.meta.isKeepAlive"></router-view>
       </keep-alive>
       <router-view v-if="!$route.meta.isKeepAlive"></router-view>
    </div>
  </div>
</template>

<script>
export default {

}
</script>

<style lang="scss">
  .toolbar{
    width: 100vw;
    height: 25px;
    background-color: #C20C0C;
    color: white;
    ul{
       display: flex;
      justify-content: space-between;
      box-sizing: border-box;
      padding: 0 50px;
      list-style: none;
      align-content: center;
        a{
          text-decoration: none; 
          color: white;
          font-size: 10px;
          height: 25px;
        }
      }
  }
</style>